<script>
import { mapState } from 'vuex'
export default {
	computed: {
		...mapState('common', ['isShowFooter'])
	}
}
</script>
<template lang="pug">
.footer.flex-center-between(v-show="isShowFooter")
	.footer-music.flex-center-between
		img(src="./img/a34fd109b3de9c82fda5f3146081800a18d8437b.jpg")
		.footer-music__info
			p 一百遍
			p 横滑可以切换上下首哦
	.footer-status
		.iconfont.icon-play
		.iconfont.icon-gedan
</template>
<style lang="stylus" scoped>
.footer
	position fixed
	padding 0 7px
	width 100%
	bottom 0
	height 55px
	box-shadow 0 -1px 1px #ccc
	box-sizing border-box
	background-color #FFF
	.footer-music
		height 0.8rem
		img
			width 0.8rem
			height 0.8rem
		.footer-music__info
			margin-left 7px
			display inline-block
			p
				line-height 1
				&:last-child
					margin-top 9px
					font-size 12px
					color #808080
	.footer-status
		>div
			display inline-block
</style>
